﻿@model IList<ProductOverviewModel>
@using Nop.Web.Models.Catalog;
@if (Model.Count > 0)
{

    <div class="product-grid home-page-product-grid">
        <div class="title mid-content-title">
            <strong>@T("ShoppingCart.CrossSells")</strong>
            @if (Model.Count > 3)
            {
                <span class="pull-right">
                    <a class="title-carousel-control" href="#carousel-example-generic-cart-page" data-slide="prev">
                        <i class="fa fa-angle-left"></i>
                    </a>
                    <a class="title-carousel-control" href="#carousel-example-generic-cart-page" data-slide="next">
                        <i class="fa fa-angle-right"></i>
                    </a>

                </span>
            }
        </div>
        
                
        

        <div id="carousel-example-generic-cart-page" class="carousel slide" data-ride="carousel">
            <!-- Indicators -->
    

            <!-- Wrapper for slides -->
            <div class="carousel-inner">
                @{
                    var ci = 0;
                } 
                @foreach (var item in Model)
                {
                    if(ci==0)
                    {
                        @:<div class="item active">
                        @:<div class="row box-products" >
                    }else if(ci%4==0){
                        @:<div class="item">
                        @:<div class="row box-products" >
                    }
                    
                    <div class="col-md-3">
                        <div class="offer offer-default silde-show-offer pull-text-center">
                            @Html.Partial("_ProductBox", item)
                        </div>
                    </div>
                    

                    if(ci%4==3){
                        @:</div>
                        @:</div>
                    }
                    ci++;
                }
                @if(ci%4!=0){
                    @:</div>
                    @:</div>
                }
        
            </div>


        </div>
    </div>



    @*<div class="product-grid cross-sells">
        <div class="title">
            <strong>@T("ShoppingCart.CrossSells")</strong>
        </div>
        @foreach (var product in Model)
        {
            <div class="col-md-4">
                <div class="offer offer-default silde-show-offer pull-text-center">
                    @Html.Partial("_ProductBox", product)
                </div>
            </div>

        }
    </div>*@
}



